<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,, initial-scale=1">
    <!-- 将替换页面标题 -->
    <title>{% block title %}Home{% endblock %}</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">
    <!-- 宏渲染分页信息 -->
    {% macro render_pagination(pagination, endpoint) %}
        <nav>
            <ul class="pagination">
                <li>
                    {% if pagination.has_prev %}
                        <a href="{{ url_for('blog.home', page=pagination.prev().page) }}" aria-label="Previous">
                    {% else %}
                        <a href="{{ url_for('blog.home', page=1) }}" aria-label="Previous">
                    {% endif %}
                    <span aria-label="true">&laquo;</span>
                    </a>
                </li>
                {% for page in pagination.iter_pages() %}
                    {% if page %}
                        {% if page != pagination.page %}
                            <li>
                                <a href="{{ url_for(endpoint, page=page) }}">
                                    {{ page }}
                                </a>
                            </li>
                        {% else %}
                            <li><a href="">{{ page }}</a></li>
                        {% endif %}
                    {% else %}
                        <li><a>...</a></li>
                    {% endif %}
                {% endfor %}
                <li>
                    <a href="{{ url_for('blog.home', page=pagination.next().page ) }}" aria-label="Next">
                        <span aria-hidden="true">&raquo;</span>
                    </a>
                <li>
            </ul>
        </nav>
    {% endmacro %}
    {% block captcha %}
    {% endblock %}
</head>
<body>
<div class="container">
    <div class="jumbotron">
        <!-- 将路由功能替换为URL: `/` -->
        <h1><a href="{{ url_for('blog.home') }} ">My Blog</a></h1>
        <p>Welcome to the blog!</p>
    </div>
    {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
            {% for category, message in messages %}
                <div class="button" class="close" data-dismiss="alert" aria-label="Close">
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    {{ messages }}
                </div>
            {% endfor %}
        {% endif %}
    {% endwith %}
    {% block body %}
        body_content
    {% endblock %}
</div>
<script src="{{ url_for('static', filename='js/jquery.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap.min.js') }}"></script>
{#<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>#}
{#<script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.2/js/bootstrap.min.js"></script>#}
{% block js %}
{% endblock %}
</body>
</html>